<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Hardcore Fetish | All For HDM Lovers</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-0evHe/X+R7YkIZDRvuzKMRqM+OrBnVFBL6DOitfPri4tjfHxaWutUpFmBp4vmVor" crossorigin="anonymous">
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0-beta1/dist/js/bootstrap.bundle.min.js" integrity="sha384-pprn3073KE6tl6bjs2QrFaJGz5/SUsLqktiwsUTF55Jfv3qYSDhgCecCxMW52nD2" crossorigin="anonymous"></script>
    <link href="style.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.8.3/font/bootstrap-icons.css">
  </head>

  <body>

    <!-- Navigation -->
    <nav class="navbar navbar-expand-md navbar-light bg-light sticky-top">
      <div class="container-fluid">
        <a class="navbar-brand" href="#">
          <img src="img/logo.png" alt="" width="150" height="70" class="d-inline-block align-text-top">
        </a>
        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
          <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarNav">
          <ul class="navbar-nav ml-auto">
            <li class="nav-item">
              <a class="nav-link active" aria-current="page" href="#">Home</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="#">Events</a>
            </li>
            <li class="nav-item dropdown">
              <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                Recent Releases
              </a>
              <ul class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
                <li><a class="dropdown-item" href="#">LP Album</a></li>
                <li><a class="dropdown-item" href="#">EP Album</a></li>
                <li><a class="dropdown-item" href="#">Single</a></li>
              </ul>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="#">Lables</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="#">Artists</a>
            </li>
          </ul>
        </div>
      </div>
    </nav>

    <!-- Events -->
    <div class="container-fluid">
      <div class="row text-center">
        <div class="col-12">
          <h1 class="display-4">Events</h1>
        </div>
      </div>
    </div>

    <!-- Image Slider -->
    <div id="carouselExampleFade" class="carousel slide carousel-fade" data-bs-ride="true">
      <div class="carousel-indicators">
        <button type="button" data-bs-target="#carouselExampleFade" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
        <button type="button" data-bs-target="#carouselExampleFade" data-bs-slide-to="1" aria-label="Slide 2"></button>
        <button type="button" data-bs-target="#carouselExampleFade" data-bs-slide-to="2" aria-label="Slide 3"></button>
      </div>
      <div class="carousel-inner">
        <div class="carousel-item active">
          <a href="https://www.q-dance.com/en/events/defqon-1/defqon-1-weekend-festival-2022/">
          <img src="img/1.png" class="d-block w-100" alt="...">
          </a>
          <div class="carousel-caption d-none d-md-block bg-secondary bg-opacity-50">
            <h5>DEFQON.1 PRIMAL ENERGY 2022</h5>
            <p>Weekend Warriors, get ready for the most powerful experience in the history of our tribe. We proudly present Defqon.1 Weekend Festival: 4 days of madness from June 23rd till June 26th in 2022!</p>
          </div>
        </div>
        <div class="carousel-item">
          <a href="https://www.b2s.nl/en/events/decibel/decibel-outdoor-2022/">
          <img src="img/2.jpg" class="d-block w-100" alt="...">
          </a>
          <div class="carousel-caption d-none d-md-block bg-secondary bg-opacity-50">
            <h5>DECIBEL OUTDOOR 2022</h5>
            <p>LIVE LOUD PODCAST #12 WITH D-STURB & ATILAX</p>
          </div>
        </div>
        <div class="carousel-item">
          <a href="https://www.q-dance.com/en/news/x-qlusive-phuture-noize-or-livestream">
          <img src="img/3.png" class="d-block w-100" alt="...">
        </a>
          <div class="carousel-caption d-none d-md-block bg-secondary bg-opacity-50">
            <h5>LIVESTREAM X-QLUSIVE PHUTURE NOIZE</h5>
            <p>There are only a few days left until we witness the sounds of a musical mastermind, who definitely left his marks within the scene. This Saturday, X-Qlusive Phuture Noize will take place in AFAS Live. Are you not able to attend X-Qlusive Phuture Noize this Saturday, but do you still want to enjoy the event? We have got you covered!</p>
          </div>
        </div>
      </div>
      <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleFade" data-bs-slide="prev">
   <span class="carousel-control-prev-icon" aria-hidden="true"></span>
   <span class="visually-hidden">Previous</span>
 </button>
 <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleFade" data-bs-slide="next">
   <span class="carousel-control-next-icon" aria-hidden="true"></span>
   <span class="visually-hidden">Next</span>
 </button>
    </div>

<!-- View All -->
<div class="row text-center viewall">
  <p>
    <a href="#">
      View All
      <i class="bi bi-arrow-right-circle"></i>
    </a>
  </p>
</div>

    <hr class="my-4">


    <!-- Released Albums -->
    <div class="container-fluid">
      <div class="row text-center">
        <div class="col-12">
          <h1 class="display-4">Recent Releases</h1>
          <h2 class="display-6">LP Albums</h2>
        </div>
      </div>
    </div>

    <div class="row row-cols-1 row-cols-md-2 g-4">
      <!-- card1 -->
      <div class="col">
        <a href="https://open.spotify.com/album/1UzOa746jQMejJtvImrB5O">
        <div class="card mb-3" style="max-width: 720px;">
          <div class="row g-0">
            <div class="col-sm-6 col-md-4">
              <img src="img/album1.jpg" class="img-fluid rounded-start" alt="...">
            </div>
            <div class="col-sm-6 col-md-8">
              <div class="card-body">
                <h4 class="card-title">Artificial Intoxication</h4>
                <h5 class="card-title">Rebelion</h5>
                <p class="card-text">An experimental, innovative, technical and storytelling album. Take a step-by-step look at Rebelion's new definition of AI in one storyline: Artificial Intoxication. From the melody to the use of sound effects to the explosion of Kick, the album is unique in every way, and directly attracts the audience's degree of surprise.</p>
                <p class="card-text"><small class="text-muted">2022/04/22</small></p>
              </div>
            </div>
          </div>
        </div>
      </a>
      </div>
      <!-- card2 -->
      <div class="col">
        <a href="https://open.spotify.com/album/50RHfqIEtQS0dZxBrrFUF3">
        <div class="card mb-3" style="max-width: 720px;">
          <div class="row g-0">
            <div class="col-sm-6 col-md-4">
              <img src="img/album2.jpg" class="img-fluid rounded-start" alt="...">
            </div>
            <div class="col-sm-6 col-md-8">
              <div class="card-body">
                <h4 class="card-title">Legends of The Elite</h4>
                <h5 class="card-title">The Elite</h5>
                <p class="card-text">A landmark LP for Dirty Workz. Founded by Coone, Da Tweekaz and Hard Drivers, Dirty Workz celebrates its 20th anniversary with Legends of The Elite, a comprehensive, innovative collection of 21st century HDM masterpieces. Like a Look back on Hardstyle's 20 years of development, full of wild but healing power.</p>
                <p class="card-text"><small class="text-muted">2022/03/25</small></p>
              </div>
            </div>
          </div>
        </div>
      </a>
      </div>

    </div>


    <!-- Released Ep -->
    <div class="container-fluid">
      <div class="row text-center">
        <div class="col-12">
          <h2 class="display-6">EP Albums</h2>
        </div>
      </div>
    </div>
    <!-- card3 -->
    <div class="row row-cols-1 row-cols-md-2 g-4">
      <div class="col">
        <a href="https://open.spotify.com/album/37A21R1l0teWXjK6EtoTp5">
        <div class="card mb-3" style="max-width: 720px;">
          <div class="row g-0">
            <div class="col-sm-6 col-md-4">
              <img src="img/EP1.jpg" class="img-fluid rounded-start" alt="...">
            </div>
            <div class="col-sm-6 col-md-8">
              <div class="card-body">
                <h4 class="card-title">Time Machine</h4>
                <h5 class="card-title">Anderex</h5>
                <p class="card-text">Follow Anderex's time machine, travel from distant and mysterious antiquity to the Renaissance, then incarnate data into the virtual universe, and finally arrive at the digital dystopia at the end of time.</p>
                <p class="card-text"><small class="text-muted">2022/05/13</small></p>
              </div>
            </div>
          </div>
        </div>
      </a>
      </div>
      <!-- card4 -->
      <div class="col">
        <a href="https://open.spotify.com/album/2QwInjj7ps4qdn2cJHSFaZ?highlight=spotify:track:3K0umTv5NyNh660poZjenG">
        <div class="card mb-3" style="max-width: 720px;">
          <div class="row g-0">
            <div class="col-sm-6 col-md-4">
              <img src="img/EP2.jpg" class="img-fluid rounded-start" alt="...">
            </div>
            <div class="col-sm-6 col-md-8">
              <div class="card-body">
                <h4 class="card-title">Electronic Heartbreak</h4>
                <h5 class="card-title">Phuture Noize</h5>
                <p class="card-text">As one of the most innovative artists in Rawstyle Era, Phuture Noize fused Metal elements deeply into the Harsstyle overall structure. After times of listening, you'll find this bizarre Hardstyle Alubum surprisingly better.</p>
                <p class="card-text"><small class="text-muted">2021/08/10</small></p>
              </div>
            </div>
          </div>
        </div>
      </a>
      </div>

    </div>

    <!-- Released Singles -->
    <div class="container-fluid">
      <div class="row text-center">
        <div class="col-12">
          <h2 class="display-6">Singles</h2>
        </div>
      </div>
    </div>
    <!-- card5 -->
    <div class="row row-cols-1 row-cols-md-2 g-4">
      <div class="col">
        <a href="https://open.spotify.com/album/0YzBhIvuaOqtdBsVjmNnDq">
        <div class="card mb-3" style="max-width: 720px;">
          <div class="row g-0">
            <div class="col-sm-6 col-md-4">
              <img src="img/single1.jpg" class="img-fluid rounded-start" alt="...">
            </div>
            <div class="col-sm-6 col-md-8">
              <div class="card-body">
                <h4 class="card-title">Break Free</h4>
                <h5 class="card-title">D-Sturb</h5>
                <p class="card-text">A stunning Anthem by D-Sturb, Released in End of Line Records, building up momentum for the coming Decibel 2022 event.</p>
                <p class="card-text"><small class="text-muted">2022/05/24</small></p>
              </div>
            </div>
          </div>
        </div>
      </a>
      </div>
      <!-- card6 -->
      <div class="col">
        <a href="https://open.spotify.com/album/10RoPitNvB3vJHJtUs2ZSv">
        <div class="card mb-3" style="max-width: 720px;">
          <div class="row g-0">
            <div class="col-sm-6 col-md-4">
              <img src="img/single2.jpg" class="img-fluid rounded-start" alt="...">
            </div>
            <div class="col-sm-6 col-md-8">
              <div class="card-body">
                <h4 class="card-title">Bow Down</h4>
                <h5 class="card-title">DEEZL</h5>
                <p class="card-text">Drilling bass kicks up straight to the brain! Xtra Raw Artist DEEZL from Gearbox grinded Gabber elements to add old-school digital flavor.</p>
                <p class="card-text"><small class="text-muted">2022/05/23</small></p>
              </div>
            </div>
          </div>
        </div>
      </a>
      </div>

    </div>

    <!-- View All -->
    <div class="row text-center viewall">
      <p>
        <a href="#">
          View All
          <i class="bi bi-arrow-right-circle"></i>
        </a>
      </p>
    </div>


    <hr class="my-4">


    <!-- Lables -->
    <div class="container-fluid">
      <div class="row text-center">
        <div class="col-12">
          <h1 class="display-4">Lables</h1>
        </div>
      </div>
    </div>

    <div class="card bg-dark text-white label">
      <img src="img/lable aoc.png" class="card-img" alt="...">
      <div class="card-img-overlay">
        <h5 class="card-title">Art of Creation</h5>
        <p class="card-text">Art of Creation unites and lives by the values of an artistic movement led by Headhunterz, Wildstylez , Noisecontrollers and more artists to come.</p>
        <a href="https://artofcreation.com/">
          <button type="button" class="btn btn-outline-light btn-lg">Visit The Website</button>
        </a>
      </div>
    </div>

    <div class="card bg-dark text-white label">
      <img src="img/lable scantraxx.jpg" class="card-img" alt="...">
      <div class="card-img-overlay">
        <h5 class="card-title">Scantraxx</h5>
        <p class="card-text">In 2002, Dov J. Elkabas, aka DJ The Prophet opened the doors to a new and innovative movement, which has now become the biggest lable in HDM feild.</p>
        <a href="https://www.scantraxx.com/">
          <button type="button" class="btn btn-outline-light btn-lg">Visit The Website</button>
        </a>
      </div>
    </div>

    <div class="card bg-dark text-white label">
      <img src="img/lable dirtyworkz.png" class="card-img" alt="...">
      <div class="card-img-overlay">
        <h5 class="card-title">Dirty Workz</h5>
        <p class="card-text">DIRTY WORKZ, the Beligium Hard Dance Music label, founded in 2006, has become the home for artists to presents a mixed version of the original Hardstyle spirit.</p>
        <a href="https://www.dirtyworkz.com/">
          <button type="button" class="btn btn-outline-light btn-lg">Visit The Website</button>
        </a>
      </div>
    </div>

    <!-- View All -->
    <div class="row text-center viewall">
      <p>
        <a href="#">
          View All
          <i class="bi bi-arrow-right-circle"></i>
        </a>
      </p>
    </div>
    <hr class="my-4">



    <!-- Artists -->
    <div class="container-fluid">
      <div class="row text-center">
        <div class="col-12">
          <h1 class="display-4">Artists</h1>
        </div>
      </div>
    </div>

    <div class="row row-cols-2 row-cols-md-4 g-8">

  <div class="col">
    <a href="https://www.scantraxx.com/artists/adrenalize">
    <div class="card">
      <img src="img/artist adrenalize.png" class="card-img-top" alt="...">
      <div class="card-body">
        <h5 class="card-title artist">Adrenalize</h5>
      </div>
    </div>
    </a>
  </div>

  <div class="col">
    <a href="https://www.scantraxx.com/artists/keltek">
    <div class="card">
      <img src="img/artist keltek.png" class="card-img-top" alt="...">
      <div class="card-body">
        <h5 class="card-title artist">Keltek</h5>
      </div>
    </div>
  </a>
  </div>

  <div class="col">
    <a href="https://www.scantraxx.com/artists/devin-wild">
    <div class="card">
      <img src="img/artist devin wild.png" class="card-img-top" alt="...">
      <div class="card-body">
        <h5 class="card-title artist">Devin Wild</h5>
      </div>
    </div>
  </a>
  </div>

  <div class="col">
    <a href="https://artofcreation.com/artists/headhunterz/">
    <div class="card">
      <img src="img/Artist Headhunterz.png" class="card-img-top" alt="...">
      <div class="card-body">
        <h5 class="card-title artist">Headhunterz</h5>
      </div>
    </div>
  </a>
  </div>

  <div class="col">
    <a href="https://artofcreation.com/artists/sound-rush/">
    <div class="card">
      <img src="img/Artist Sound Rush.png" class="card-img-top" alt="...">
      <div class="card-body">
        <h5 class="card-title artist">Sound Rush</h5>
      </div>
    </div>
  </a>
  </div>

  <div class="col">
    <a href="https://artofcreation.com/artists/wildstylez/">
    <div class="card">
      <img src="img/Artist Wildstylez.png" class="card-img-top" alt="...">
      <div class="card-body">
        <h5 class="card-title artist">Wildstylez</h5>
      </div>
    </div>
  </a>
  </div>

  <div class="col">
    <a href="http://www.subzeroproject.com/">
    <div class="card">
      <img src="img/artist szp.jpg" class="card-img-top" alt="...">
      <div class="card-body">
        <h5 class="card-title artist">Sub Zero Project</h5>
      </div>
    </div>
  </a>
  </div>

  <div class="col">
    <a href="https://www.youtube.com/c/DJBFront/featured">
    <div class="card">
      <img src="img/artist b-front.jpg" class="card-img-top" alt="...">
      <div class="card-body">
        <h5 class="card-title artist">B-front</h5>
      </div>
    </div>
  </a>
  </div>

</div>

<!-- View All -->
<div class="row text-center viewall">
  <p>
    <a href="#">
      View All
      <i class="bi bi-arrow-right-circle"></i>
    </a>
  </p>
</div>



<!--- Footer -->
<footer>
	<div class="container-fluid">
		<div class="row text-center">
			<div class="col-md-4 ">
        <hr class="light">
				<img src="img/logo white.png" width="250" height="100" >
        <hr class="light">
			</div>

			<div class="col-md-4 footerp">
				<p>Home</p>
				<p>Events</p>
				<p>Releases</p>
			</div>
			<div class="col-md-4 footerp">
				<p>Labels</p>
				<p>Artists</p>
				<p>Connect</p>
			</div>
      <hr class="my-4">

        <div class="col-md-6">
        <h5 class="copyright">&copy; hardcorefetish 2022 | All rights reserved</h5>
        </div>
        <div class="col-md-6 social">
          <a href="https://github.com/arbayisnerdy"><i class="bi bi-github"></i></a>
          <a href="#"><i class="bi bi-twitter"></i></a>
          <a href="#"><i class="bi bi-youtube"></i></a>
          <a href="#"><i class="bi bi-facebook"></i></a>
          <a href="#"><i class="bi bi-instagram"></i></a>
          <a href="#"><i class="bi bi-spotify"></i></a>
        </div>
			</div>
		</div>

</footer>




  </body>
</html>
